<template>
	<view class="list" @click="goteam(scitem.project.id)">
		<view class="scitem">
			<view class="title">
				{{scitem.project.introduce}}
			</view>
			<view class="flex justify align">
				<view class="troops">
					需求：
					<text class="troops_arr" v-for="(item,index) in scitem.project.troops_arr">
						{{item}} 
						<template v-if="index != scitem.project.troops_arr.length"></template>
					</text>
					<text class="work_arr" v-for="(item,index) in scitem.project.work_arr"> | {{item}}</text>
				</view>
				<view class="" @tap="toCall(scitem.project.phone)">
					<image class="tel_icon" src="../static/icon/tel.png" mode="aspectFill"></image>
				</view>
			</view>
			
			<view class="time flex justify align">
				<view class="title_name">
					{{timestampToTime(scitem.project.user.createtime)}} 发布
				</view>
				<view class="title_dizhi flex align">
					<image src="../static/icon/addr.png" mode="aspectFill"></image>
					<text>{{scitem.project.province}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp()
	
	export default {
		data(){
			return {
				
			}
		},
		props: {
			scitem: {
				type: Object
			},
		},
		onLoad() {
			
		},
		methods:{
			// 拨打电话
			toCall(tel){
				uni.makePhoneCall({
					phoneNumber: tel //仅为示例
				});
			},
			// 查看详情
			goteam(id){
				uni.navigateTo({
					url:'/pages/TeamDetails/TeamDetails?id='+id
				})
			},
			timestampToTime(timestamp) {
				timestamp = timestamp ? timestamp : null;
				let date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
				let Y = date.getFullYear();
				let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
				let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
				let h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
				let m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
				let s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
				return M + '月' + D + '日'
				// console.log(Y + M + D + h + m + s)
			},
		}
	}
</script>

<style lang="scss">
	.list {
		background-color: #fff;
		padding: 20rpx;
		border-radius: 20rpx;
		margin:0 30rpx 20rpx;
		position: relative;
		.scitem{
			background: #fff;
			border-radius: 10rpx;
			margin-bottom: 20rpx;
			.title{
				font-size: 30rpx;
				color: #000;
				margin-bottom: 30rpx;
			}
			.troops{
				color: #888;
				width: 88%;
				margin-bottom: 20rpx;
			}
			.tel_icon{
				width: 60rpx;
				height: 60rpx;
			}
			.troops_arr{
				color: var(--base);
			}
			.work_arr{
				padding-left: 10rpx;
			}
			.title_dizhi{
				image{
					width: 24rpx;
					height: 24rpx;
					margin-right: 8rpx;
				}
			}
			.time{
				color: #999;
				font-size: 24rpx;
			}
		}
	}
</style>